<template>
  <el-tooltip class="item" effect="dark" placement="right" :enterable="false" @mouseenter.native="xhrDetail">
    <slot name="img"></slot>
    <div v-if="loading" slot="content">加载中</div>
    <div v-else slot="content">
      <span>活体：{{ data.label }}<br></span>
      <span>概率：{{ data.rate }}<br></span>
      <span>年龄： {{ data.ageList ? data.ageList.join(","): "" }}<br></span>
      <span>颜值：{{ data.beuatyList ? data.beuatyList.join(","): "" }}<br></span>
      <span>性别：{{ data.genderList? data.genderList.join(","): "" }}<br></span>
      <span>相同度：{{ data.confidence }}<br></span>
      <span>识别值：{{ data.thresholds }}<br></span>
    </div>
  </el-tooltip>
</template>

<script>
import { xhrCheckFaceCheckInfo } from '@/api/account';
export default {
    name: 'TooptipsCom',
    props: {
        imageId: {
            type: String,
            required: false
        }
    },
    data() {
        return {
            loading: true,
            timer: null,
            data: null
        }
    },
    methods: {
      xhrDetail() {
        if (this.data == null && this.imageId) {
          this.loading = true
          console.log('请求图片数据')
          xhrCheckFaceCheckInfo({
            imageUrl: this.imageId,
            pageNum: 1,
            pageSize: 10000
          })
            .then((resp) => {
              this.loading = false
              this.data = resp.data;
              if (this.data.genderList) {
                const genderList = JSON.parse(this.data.genderList)
                for (const i in genderList) {
                  genderList[i] = genderList[i] === 0 ? '女' : '男'
                }
                this.data.genderList = genderList
              }
              if (this.data.label) {
                if (this.data.label === 'normal') {
                  this.data.label = '活体照片'
                } else {
                  this.data.label = '翻拍照片'
                }
              }
              this.data.ageList = this.data.ageList ? JSON.parse(this.data.ageList) : []
              this.data.beuatyList = this.data.beuatyList ? JSON.parse(this.data.beuatyList) : []
            })
            .catch((err) => {
              console.log(err)
              // this.$message.error(err);
            });
        }
      }
    }
}
</script>
